<link rel="stylesheet" href="css/aliceui.min.css"/>
<link rel="stylesheet" href="css/resetui.css"/>
<link rel="stylesheet" href="css/reg.css"/>
<style type="text/css">
    #create_new_lnk{display: none;}
    .message{border: 1px solid #0088cc;}
</style>
<script type="text/javascript">document.title="添加分销商 - <?=$data['web_title']?>";</script>
<!--主体-->
<div class="r_content" id="register">
    <h3 class="mc_title">
        <span class="mctit_1"><span class="mctit_2">添加分销商</span></span>
    </h3>
    <div class="ui-tiptext-container ui-tiptext-container-question mt10">
        <p class="ui-tiptext ui-tiptext-warning">
            <span class="ui-form-required">+</span>直接输入分销商名称（仅限中文）,若列表中存在请直接点“添加”；若不存在，请点“创建新分销商”。<br/>
            <span class="ui-form-required">+</span>添加成功后请点击“价格配置”为分销商配置结算价。
        </p>
    </div>
    <form id="reg_form" class="reg_form">
        <?=$data['csrf_token'];?>
        <input type="hidden" name="action" value="RelationshipCreate"/>
        <input type="hidden" name="actionType" value="CreateDistor"/>
        <input type="hidden" name="dtype" value="1"/>
        <table class="add_table">
            <tr>
                <td class="tab1"><span class="ui-form-required">*</span>分销商名称</td>
                <td class="tab2">
                   <input type="text" id="dname_e" class="ui-input" name="company" />
                   <a href="javascript:" id="create_new_lnk">创建新分销商</a>
                </td>
                <td class="tab3">
                    <p class="normal">输入分销商名称，仅限中文</p>
                    <p class="error"></p>
                    <p class="ok">&nbsp;</p>
                </td>
            </tr>
            <tbody id="create_new_one">
                <tr>
                    <td class="tab1"><span class="ui-form-required">*</span>姓名</td>
                    <td>
                        <input type="text" id="dname_c" data-msg="请输入分销商真实姓名" class="ui-input required" name="username" />
                    </td>
                    <td class="tab3">
                        <p class="normal">请输入联系人姓名，仅限中文</p>
                        <p class="error"></p>
                        <p class="ok">&nbsp;</p>
                    </td>
                </tr>
                <tr>
                    <td class="tab1"><span class="ui-form-required">*</span>密码</td>
                    <td class="tab2">
                        <input type="password" data-msg="密码不能为空" class="ui-input required" name="password" />
                    </td>
                    <td class="tab3">
                        <p class="normal">6-16个字符,请使用字母加数字或符号的组合</p>
                        <p class="error"></p>
                        <p class="ok">&nbsp;</p>
                    </td>
                </tr>
                <tr id="pwd_strength">
                    <td>&nbsp;</td>
                    <td colspan="2">
                        <div class="pwd_strength">
                            <span class="qian" id="sqian">密码强度</span>
                                <span class="meter-bar">
                                    <div id="pwlevel" style="width: 75%;"></div>
                                </span>
                            <span id="pwlevel2">中</span>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td class="tab1"><span class="ui-form-required">*</span>确认密码</td>
                    <td class="tab2">
                        <input type="password" class="ui-input required" name="confirmPwd" />
                    </td>
                    <td class="tab3">
                        <p class="normal">请再次输入密码</p>
                        <p class="error"></p>
                        <p class="ok">&nbsp;</p>
                    </td>
                </tr>
                <tr>
                    <td class="tab1"> 手机号</td>
                    <td class="tab2">
                        <input type="text" class="ui-input" name="mobile"/>
                    </td>
                    <td class="tab3">
                        <p class="normal">请输入分销商手机号，必须唯一</p>
                        <p class="error"></p>
                        <p class="ok">&nbsp;</p>
                    </td>
                </tr>
                <tr>
                    <td class="tab1"> 固定电话</td>
                    <td class="tab2"><input type="text" data-msg="请填写公司固定电话" class="ui-input" name="g_tel" /></td>
                    <td class="tab3">
                        <p class="normal">请填写公司固定电话</p>
                        <p class="error"></p>
                        <p class="ok">&nbsp;</p>
                    </td>
                </tr>
                <tr>
                    <td>&nbsp;</td>
                    <td colspan="2">
                        <input type="button" id="distor_btn_c" value="" class="submit_btn_d"/>
                    </td>
                </tr>
            </tbody>
        </table>
        <ul id="salers_ul"></ul>
        <table id="selected_distor">
            <thead>
            <tr>
                <th class="first">分销商名称</th>
                <th>联系人</th>
                <th>操作</th>
            </tr>
            </thead>
            <tbody id="selected_distor_list" class="hide"></tbody>
            <tbody>
            <?if(isset($data['admin'])):?>
            <tr id="dist_<?=$data['admin']['id']?>">
                <td class="first">[<?=$data['admin']['account']?>]先行网</td>
                <td><?=$data['admin']['cname']?>[<?=$data['admin']['mobile']?>]</td>
                <td><a href="javascript:" class="selected_distor_add" data-id="<?=$data['admin']['id']?>">添加</a></td>
            </tr>
            <?endif;?>
            </tbody>
        </table>
    </form>
</div>
<!--<script type="text/javascript" src="js/jquery.getareas.js"></script>-->
<!--    <script type="text/javascript" src="js/easydialog.min.js"></script>-->
<script type="text/javascript" src="js/fun.inc.js"></script>
<script type="text/javascript" src="js/prod_pub.js"></script>
<script type="text/javascript" src="js/reg.js"></script>
<script type="text/javascript">
    jQuery(document).ready(function($){
        $("a#create_new_lnk").on('click', function(){
            if($(this).hasClass('opened')) {
                $("tbody#create_new_one").hide();
                $(this).removeClass('opened').text('创建新分销商');
            } else {
                $("tbody#create_new_one").show();
                $("#selected_distor").hide();
                $(this).addClass('opened').text('选择已有分销商');
            }
        });
        $("#dname_e").on('keyup', function(){
            if($("#create_new_lnk").hasClass('opened')) {
                return;
            }
            var v = $(this).val();
            if(v.length>=2 && pub.is_chinese(v)) {
                var salers_list = '', c= 0, lnk='';
                $("#selected_distor").show();
                $("#create_new_lnk").show();
                if($("#selected_distor_list").hasClass('hide')) {
                    $("#selected_distor_list").removeClass('hide');
                }
                $("#selected_distor_list").empty();
                $.getJSON(reg.request_url,{action:'SearchDistor2',sname:v})
                .done(function(salers){
                    for(var k in salers) {
                        c += 1;
                        if(salers[k].dname==v) {
                            $("#create_new_lnk").hide();
                        }
                        if( ! $("tr#dist_"+salers[k].id).length ) {
                            if(salers[k].created==1) {
                                lnk = '已添加|<a target="_blank" href="priceset.html?did='+salers[k].id+'">价格配置</a>';
                            } else {
                                lnk = '<a href="javascript:" class="selected_distor_add" ' +
                                        'data-id="'+salers[k].id+'">添加</a>';
                            }
                            salers_list = '<tr id="dist_'+salers[k].id+'">' +
                                    '<td class="first">['+salers[k].passport+']'+salers[k].dname+
                                    '</td><td>'+salers[k].cname+'['+salers[k].mobile+']' +
                                    '</td>' +'<td>'+lnk+'</td></tr>';
                            $("#selected_distor_list").append(salers_list);
                        }
                    }
                });
            }
        });

        $("#selected_distor").on('click', 'a.selected_distor_add', function(){
            var did = $(this).attr('data-id'),
                param = {
                    action: 'AddRelationShip',
                    distor: did,
                    token : reg.getToken()
                },
                elem = $(this);
            $.post(reg.request_url,param,function(json_res){
                if(json_res.status=='ok') {
                    elem.parent('td').html('已添加|<a target="_blank" href="priceset.html?did='+did+'">价格配置</a>');
                } else {
                    alert(json_res.msg);
                }
            },'json');
        });
    });
</script>